<template>
  <div class="box">
    <!--通用echart操作列-->
    <el-form ref="form" label-width="100px" style="width: 90%">
      <el-form-item label="图层名：">
        <el-input size="mini" v-model="chooseComponent.layerName"></el-input>
      </el-form-item>
      <el-form-item label="在线文档：">
        <a href="#" style="font-size: 12px;color: #409eff" @click="viewDocment()">点击查看</a>
      </el-form-item>
      <el-form-item label="配置列表：">
        <el-button size="mini" @click="$refs.jsonEdit.open(chooseComponent.option.echartOption)">编辑</el-button>
      </el-form-item>
    </el-form>
    <jsonEdit ref="jsonEdit" @ok="jsonEditOk"></jsonEdit>
  </div>
</template>

<script>
  export default {
    name: "op_general",
    components: {
      'jsonEdit': () => import('@/components/jsonEdit/index.vue'),
    },
    computed: {
      //当前选中的值
      chooseComponent() {
        return this.$store.state.chooseComponent
      },
    },
    data(){
      return{
        active:"1",
      }
    },
    methods:{

      //json编辑确认
      jsonEditOk(obj){
        this.chooseComponent.option.echartOption=obj;
      },

      //查看文档
      viewDocment(){
        window.open("https://echarts.apache.org/examples/zh/index.html");
      }
    }
  }
</script>

<style scoped lang="less">
  .box {
    width: 100%;
    flex: 1;
    color: white;

  }
</style>
